import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
import App from "./App";
import reportWebVitals from "./reportWebVitals";
import * as Sentry from "@sentry/react";
import { Integrations } from "@sentry/tracing";
import { createBrowserHistory } from "history";
import { Router, Route, Switch, Link, matchPath } from "react-router-dom";
const routes = [{ path: "/about" }, { path: "/user/:id" }, { path: "/" }];
const history = createBrowserHistory();

Sentry.init({
  dsn: "http://87ebf98cff1648feb304d60398860856@localhost:9000/3",
  environment: "localhost",
  integrations: [
    new Integrations.BrowserTracing({
      routingInstrumentation: Sentry.reactRouterV5Instrumentation(
        history,
        routes,
        matchPath
      ),
    }),
  ],

  // Set tracesSampleRate to 1.0 to capture 100%
  // of transactions for performance monitoring.
  // We recommend adjusting this value in production
  tracesSampleRate: 1.0,
  release: "0.0.1",
});

function fn() {
  console.log(window.a.b);
}

ReactDOM.render(
  <React.StrictMode>
    <Router history={history}>
      <>
        <nav>
          <ul>
            <li>
              <Link to="/">Home</Link>
            </li>
            <li>
              <Link to="/about">About</Link>
            </li>
            <li>
              <Link to="/user/1">User1</Link>
            </li>
            <li>
              <Link to="/user/2">User2</Link>
            </li>
          </ul>
        </nav>
        <Switch>
          <Route path="/about" children={() => <div>about</div>} />
          <Route path="/user/:id" children={() => <div>user</div>} />
          <Route
            exact
            path="/"
            children={() => <button onClick={fn}>Break the world</button>}
          />
        </Switch>
      </>
    </Router>
  </React.StrictMode>,
  document.getElementById("root")
);

// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();
